<template>
  <div>
    <h1>{{ message }}</h1>
    <input type="number" v-model="num1" placeholder="输入第一个数字" />
    <input type="number" v-model="num2" placeholder="输入第二个数字" />
    <button @click="add">计算</button>
    <p v-if="result !== null">结果：{{ result }}</p>

  </div>
</template>

<script>
import axios from 'axios';
export default {
  data() {
    return {
      message: "加法计算器",
      num1: 0,              // 第一个输入框的值
      num2: 0,              // 第二个输入框的值
      result: null          // 计算结果
    };
  },
  methods: {
    async add() {
      try {
        // 发送请求到后端计算加法
        const response = await axios.post('http://localhost:8888/add/add-number', {
          num1: this.num1,
          num2: this.num2
        });

        // 获取计算结果
        this.result = response.data;
      } catch (error) {
        console.error("请求失败：", error);
      }
    }
  }
}
</script>
<style>


</style>
